<template>
  <div>
    <pt-search :params="params" :config="config" label-width="110px" @search="search"/>
    <pt-table :columns="columns" :dataSource="tableData"
      :options="options" :fetch="getTableList" :pagination="pagination" />
  </div>
</template>
<script>
import { sharingRecordList } from '@/api/activity.js'
export default {
  data() {
    return { // 表单配置
      columns: [{ 
        prop: 'userMobile', label: '分享用户', minWidth: 140
      },{ 
        prop: 'createTime', label: '分享时间', minWidth: 140
      },{ 
        prop: 'num', label: '总数量', minWidth: 120, align: 'left'
      },{ 
        prop: 'redGetNum', label: '已领数量', minWidth: 120, align: 'left'
      },{ 
        prop: 'usedNum', label: '已使用数量', minWidth: 130, align: 'left'
      },{ 
        prop: 'redGetAmount', label: '已领取金额', minWidth: 130, align: 'left'
      },{ 
        prop: 'usedAmount', label: '已使用红包金额', minWidth: 160, align: 'left'
      }],
      pagination: { total: 0, page: 0, size: 10, curPage: 1 }, // 分页
      options: { // 表单外观
        mutiSelect: false, // 多选则 mutiSelect
        index: false, // 显示序号
        loading: false, // 表格动画
        initTable: true // 是否一挂载就加载数据Q
      },
      tableData: [], // 表单数据
      config: [{ 
        key: 'mobile', type: 'input', label: '用户信息', placeholder: '请输入用户手机号、昵称、id'
      },{ 
        key: 'page', type: 'button', group: [{
          name: '查看', type: 'primary', onClick: () => { } 
        },{ 
          name: '重置', type: 'info', onClick: () => this.reset() 
        }]
      }],
      params: {
        page: 0,
        size: 10,
        mobile: '',
        status: ''
      }
    }
  },
  methods: {
    search() { // 搜索
      this.pagination.curPage = 1
      this.pagination.page = 0
      this.getTableList()
    },
    reset() { // 重置
      this.pagination.curPage = 1
      for (const key in this.params) {
        if (key === 'page') {
          this.pagination.page = 0
        } else if (key === 'size') {
          this.pagination.size = 10
        } else if (key === 'agentIds') {
          this.params[key] = []
        } else {
          this.params[key] = ''
        }
      }
      this.getTableList()
    },
    handleClick(id) { // 查看/修改订单操作
      this.dialogTableVisible = !this.dialogTableVisible
      this.diyLoading = true
      api.orderInfo({ id }).then(res => {
        this.diyLoading = false
        this.curOrderlist = res.data
      }).catch(() => { this.diyLoading = false })
    },
    getTableList() { // 获取订单数据
      this.options.loading = true
      const params = { ...this.params }
      params.page = this.pagination.page
      params.size = this.pagination.size
      sharingRecordList(params).then(res => {
        if (res.success) {
          this.tableData = res.data.list
          this.pagination.total = res.data.total
        }
      }).finally(() => { this.options.loading = false })
    }
  }
}
</script>
<style scoped>
  
</style>
